/* eslint-disable react/no-array-index-key */
import { gsap } from "gsap";
import { useIsMounted } from "@better-hooks/lifecycle";
import { useWindowSize } from "@site/src/hooks/use-window-size";
import { MotionPathPlugin } from "gsap/dist/MotionPathPlugin";
import { useCallback, useLayoutEffect, useState } from "react";

import { Animation } from "./animations/animation.types";
import { Glow } from "./glow/glow";
import { Dot } from "./dot/dot";

const tools: Array<{ name: string; dotClassName: string }> = [
  {
    name: "form data",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "rest",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "websockets",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "sse",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "firebase",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "realtime",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "upload",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "download",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "stream",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "form data",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "rest",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "websockets",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "sse",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
  {
    name: "firebase",
    dotClassName: "bg-yellow-500 shadow-neon shadow-yellow-500",
  },
];

const paths = [
  "M-137.178 380.636C-154.748 451.441 -94.4807 523.24 -24.1997 542.72C46.0946 562.231 121.053 542.636 189.627 517.656C258.214 492.706 326.535 461.938 399.408 458.549C550.233 451.563 678.856 560.701 786.951 665.993C895.046 771.285 1014.48 886.316 1165.16 896.055C1283.3 903.672 1394.25 843.843 1510.08 819.311C1712.27 776.47 1935 850.273 2071.41 1005.39",
  "M-136.881 360.952C-154.491 431.664 -94.8608 503.517 -24.9372 523.7C-18.6934 525.52 -12.3837 526.982 -6.06092 528.219C58.3782 540.505 126.062 523.086 188.564 501.119C200.633 496.882 212.698 492.464 224.763 488.045C281.404 467.28 338.47 446.478 398.471 444.009C417.913 443.194 437.016 444.319 455.736 447.111C582.04 465.868 691.257 560.643 784.57 652.953C791.344 659.673 798.162 666.409 805.025 673.164C906.625 773.155 1018.39 874.014 1157.24 888.215C1196.96 892.271 1236.28 889.867 1275.9 881.843C1322.67 872.39 1368.88 855.488 1414.4 839.391C1445.49 828.406 1476.43 817.774 1507.92 809.766C1522.72 806.002 1537.68 802.865 1552.79 800.4C1648.94 784.658 1750.32 796.514 1842.48 831.343C1934.87 866.259 2018.21 923.78 2082.74 998.507",
  "M-136.585 341.267C-154.253 411.93 -95.272 483.806 -25.7059 504.692C-19.4798 506.556 -13.2054 508.107 -6.90021 509.388C57.261 522.306 124.91 505.745 187.533 484.568C199.624 480.468 211.68 476.2 223.767 471.918C280.475 451.82 337.63 431.566 397.552 429.424C416.971 428.729 436.057 429.898 454.772 432.765C581.033 452.017 689.772 546.96 782.237 639.855C788.95 646.601 795.72 653.395 802.49 660.19C903.012 760.827 1012.87 861.186 1149.43 880.259C1189.32 885.848 1229.14 886.05 1269.94 878.727C1318.16 870.08 1365.73 851.749 1411.69 833.854C1443.06 821.648 1474.07 809.558 1505.78 800.176C1520.71 795.771 1535.76 792.006 1551.1 788.966C1648.65 769.581 1753.94 780.893 1848.66 817.224C1943.58 853.613 2028.34 914.185 2094.06 991.663",
  "M-136.321 321.595C-154.028 392.165 -95.7151 464.109 -26.4888 485.654C-20.3113 487.576 -14.0721 489.215 -7.7846 490.54C56.1429 504.108 123.726 488.417 186.456 468C198.538 464.05 210.661 459.937 222.739 455.806C279.514 436.374 336.727 416.682 396.6 414.853C415.985 414.246 435.035 415.504 453.733 418.415C579.906 438.144 688.199 533.243 779.828 626.753C786.492 633.557 793.169 640.391 799.877 647.212C899.335 748.527 1007.36 848.464 1141.51 872.344C1181.64 879.483 1221.9 882.243 1263.91 875.607C1313.58 867.798 1362.51 848.007 1408.89 828.281C1440.57 814.843 1471.61 801.277 1503.54 790.551C1518.56 785.488 1533.79 781.1 1549.32 777.498C1648.27 754.471 1757.46 765.207 1854.72 803.041C1952.2 840.932 2038.37 904.525 2105.3 984.74",
  "M-136.038 301.881C-153.772 372.39 -96.1084 444.357 -27.2704 466.618C-21.0973 468.614 -14.92 470.28 -8.66779 471.694C54.995 485.925 122.531 471.06 185.367 451.403C197.485 447.621 209.585 443.627 221.717 439.619C278.559 420.855 335.874 401.741 395.686 400.196C415.048 399.708 434.081 401.01 452.743 404.009C578.859 424.203 686.657 519.514 777.501 613.582C784.103 620.412 790.731 627.304 797.36 634.196C895.739 736.157 1002 835.903 1133.68 864.359C1174.02 873.093 1214.78 878.384 1257.95 872.418C1309.12 865.433 1359.37 844.195 1406.19 822.671C1438.14 807.981 1469.26 792.988 1501.44 780.875C1516.54 775.184 1531.95 770.173 1547.69 765.965C1648.04 739.264 1761.14 749.486 1860.95 788.793C1960.97 828.156 2048.56 894.799 2116.7 977.753",
  "M-135.742 282.197C-153.546 352.626 -96.5063 424.678 -28.039 447.611C-21.9144 449.666 -15.7415 451.406 -9.50693 452.864C53.8912 467.759 121.379 453.72 184.335 434.854C196.476 431.209 208.598 427.351 220.721 423.494C277.63 405.397 335.034 386.831 394.766 385.612C414.093 385.213 433.091 386.603 451.78 389.664C577.852 410.353 685.159 505.802 775.168 600.485C781.721 607.373 788.244 614.274 794.824 621.223C892.125 723.831 996.651 823.552 1125.85 856.449C1166.46 866.781 1207.61 874.582 1251.98 869.347C1304.59 863.168 1356.2 840.502 1403.49 817.165C1435.75 801.242 1466.94 784.791 1499.3 771.316C1514.54 764.985 1530.04 759.346 1546.02 754.564C1647.76 724.22 1764.76 733.867 1867.12 774.676C1969.66 815.555 2058.69 885.205 2128.04 970.896",
  "M-135.446 262.512C-153.277 332.879 -96.9175 404.967 -28.7767 428.59C-22.7007 430.702 -16.5322 432.518 -10.3462 434.033C52.805 449.547 120.24 436.409 183.259 418.286C195.422 414.777 207.549 411.101 219.694 407.381C276.657 389.92 334.132 371.946 393.816 371.041C413.121 370.761 432.114 372.227 450.755 375.345C576.77 396.498 683.613 492.146 772.774 587.414C779.265 594.328 785.739 601.287 792.226 608.276C888.449 711.531 991.309 811.383 1117.94 848.533C1158.82 860.509 1200.38 870.805 1245.95 866.227C1300.02 860.886 1352.98 836.759 1400.69 811.593C1433.24 794.45 1464.5 776.541 1497.07 761.691C1512.39 754.701 1528.06 748.44 1544.27 743.083C1647.42 709.096 1768.32 718.198 1873.22 760.479C1978.3 802.83 2068.75 875.532 2139.32 963.96",
  "M-135.18 242.841C-153.082 313.129 -97.3285 385.258 -29.5895 409.566C-23.5311 411.722 -17.4111 413.595 -11.2294 415.186C51.6571 431.362 119.045 419.051 182.184 401.718C194.338 398.36 206.518 394.808 218.654 391.238C275.715 374.43 333.262 357.048 392.853 356.44C412.123 356.248 431.111 357.789 449.716 360.996C575.674 382.612 682.041 478.429 770.366 574.313C776.778 581.298 783.19 588.283 789.615 595.298C884.76 699.2 985.927 799.377 1110.02 840.618C1151.2 854.299 1193.13 866.998 1239.93 863.139C1295.46 858.635 1349.77 833.048 1397.92 806.083C1430.78 787.707 1462.08 768.353 1494.9 752.116C1510.35 744.485 1526.11 737.595 1542.55 731.664C1647.09 694.003 1771.9 702.56 1879.35 746.344C1986.98 790.199 2078.84 865.92 2150.59 957.1",
  "M-134.896 223.127C-152.838 293.322 -97.7516 365.518 -30.339 390.517C-24.3159 392.761 -18.2135 394.679 -12.0804 396.327C50.5724 413.153 117.863 401.726 181.14 385.14C193.33 381.949 205.501 378.547 217.66 375.114C274.787 358.974 332.423 342.139 391.935 341.858C411.2 341.741 430.123 343.384 448.741 346.622C574.625 368.746 680.544 464.719 768.021 561.186C774.372 568.198 780.735 575.24 787.081 582.327C881.117 686.889 980.631 787.483 1102.18 832.678C1143.66 848.095 1185.99 863.184 1233.93 860.008C1290.91 856.311 1346.58 829.294 1395.17 800.53C1428.3 780.935 1459.66 760.091 1492.7 742.48C1508.24 734.221 1524.17 726.678 1540.8 720.185C1646.74 678.881 1775.43 686.907 1885.45 732.15C1995.62 777.476 2088.92 856.279 2161.87 950.166",
  "M-134.603 203.437C-152.602 273.584 -98.1348 345.79 -31.1106 371.504C-25.1051 373.793 -19.0381 375.799 -12.9536 377.504C49.4213 394.963 116.678 384.393 180.061 368.567C192.273 365.513 204.467 362.248 216.647 358.952C273.842 343.479 331.536 327.205 390.999 327.238C410.243 327.24 429.147 328.927 447.731 332.254C573.557 354.842 678.999 450.983 765.672 548.053C771.961 555.091 778.245 562.204 784.529 569.318C877.486 674.526 975.321 775.733 1094.31 824.7C1136.08 841.898 1178.81 859.345 1227.95 856.857C1286.39 853.996 1343.43 825.551 1392.47 794.944C1425.91 774.084 1457.32 751.827 1490.6 732.828C1506.23 723.91 1522.32 715.744 1539.19 708.676C1646.52 663.699 1779.12 671.18 1891.69 717.926C2004.39 764.724 2099.14 846.565 2173.28 943.203",
  "M-134.306 183.756C-152.345 253.81 -98.5322 326.114 -31.892 352.469C-25.9351 354.816 -19.9166 356.879 -13.8055 358.646C48.3357 376.755 115.527 367.055 179.017 351.989C191.22 349.085 203.436 345.957 215.639 342.798C272.887 327.961 330.696 312.297 390.067 312.626C409.275 312.717 428.145 314.492 446.724 317.893C572.493 340.946 677.458 437.256 763.296 534.941C769.536 542.037 775.758 549.176 781.949 556.33C873.829 662.184 969.976 764.154 1086.43 816.775C1128.51 835.783 1171.6 855.528 1221.95 853.727C1281.85 851.704 1340.24 821.799 1389.7 789.361C1423.45 767.268 1454.9 743.566 1488.4 723.192C1504.15 713.634 1520.35 704.84 1537.44 697.198C1646.17 648.578 1782.68 655.514 1897.8 703.763C2013.06 752.064 2109.22 836.925 2184.57 936.3",
  "M-134.041 164.084C-152.138 234.09 -98.9741 306.417 -32.6604 333.462C-26.7389 335.897 -20.738 338.005 -14.6755 339.829C47.201 358.601 114.344 349.728 177.91 335.434C190.135 332.668 202.387 329.708 214.581 326.698C271.896 312.529 329.794 297.413 389.117 298.055C408.303 298.265 427.155 300.085 445.73 303.562C571.455 327.109 675.912 423.601 760.933 521.857C767.111 528.979 773.253 536.19 779.396 543.401C870.197 649.902 964.59 752.736 1078.56 808.877C1120.92 829.741 1164.41 851.77 1215.95 850.669C1277.29 849.453 1337.05 818.119 1386.95 783.882C1420.98 760.57 1452.49 735.409 1486.21 713.661C1502.05 703.445 1518.41 694.027 1535.73 685.81C1645.87 633.547 1786.28 639.938 1903.94 689.659C2021.74 739.433 2119.32 827.345 2195.88 929.458",
  "M-133.759 144.37C-151.895 214.283 -99.3683 286.664 -33.443 314.426C-27.539 316.905 -21.5734 319.101 -15.5153 321C46.0966 340.435 113.205 332.42 176.878 318.886C189.139 316.287 201.368 313.446 213.585 310.574C270.967 297.071 328.923 282.516 388.197 283.472C407.348 283.771 426.208 285.697 444.735 289.231C570.403 313.243 674.383 409.903 758.568 508.774C764.698 515.954 770.778 523.192 776.828 530.442C866.565 637.621 959.15 741.452 1070.7 800.982C1113.35 823.731 1157.24 847.969 1209.96 847.569C1272.76 847.19 1333.87 814.396 1384.23 778.347C1418.58 753.801 1450.15 727.152 1484.09 704.06C1500.06 693.203 1516.55 683.144 1534.07 674.366C1645.6 618.429 1789.92 624.276 1910.13 675.5C2030.48 726.776 2129.47 817.709 2207.22 922.572",
  "M-133.463 124.681C-151.657 194.545 -99.7797 266.949 -34.1809 295.401C-28.3256 297.937 -22.3777 300.178 -16.3548 302.166C45.0101 322.22 112.053 315.075 175.833 302.3C188.116 299.839 200.35 297.179 212.575 294.413C270.024 281.577 328.083 267.601 387.264 268.853C406.38 269.241 425.205 271.254 443.727 274.864C569.307 299.353 672.854 396.199 756.192 495.655C762.228 502.875 768.26 510.17 774.248 517.447C862.907 625.273 953.65 730.188 1062.83 793.004C1105.74 817.698 1150.06 844.13 1203.99 844.418C1268.25 844.877 1330.71 810.622 1381.5 772.744C1416.11 746.947 1447.76 718.87 1481.92 694.404C1497.99 682.919 1514.62 672.251 1532.36 662.867C1645.28 603.287 1793.51 608.589 1916.27 661.285C2039.15 714.034 2139.56 808.017 2218.52 915.618",
  "M-133.197 105.016C-151.431 174.787 -100.221 247.258 -34.9931 276.382C-29.1863 278.976 -23.2428 281.291 -17.2685 283.337C43.8318 304.054 110.84 297.766 174.727 285.752C187.001 283.441 199.288 280.904 211.549 278.306C269.083 266.093 327.212 252.709 386.315 254.288C405.408 254.795 424.216 256.853 442.72 260.506C568.243 285.459 671.313 382.474 753.846 482.532C759.834 489.81 765.805 497.131 771.7 504.448C859.28 612.921 948.159 719.04 1054.98 785.068C1098.15 811.736 1142.87 840.302 1197.98 841.291C1263.7 842.556 1327.49 806.885 1378.74 767.195C1413.67 740.165 1445.36 710.643 1479.77 684.789C1495.91 672.646 1512.72 661.354 1530.68 651.396C1645.01 588.173 1797.14 592.899 1922.44 647.098C2047.88 701.35 2149.7 798.353 2229.87 908.692",
  "M-132.9 85.3296C-151.192 155.053 -100.601 227.534 -35.7616 257.374C-29.9591 260.043 -24.0641 262.416 -18.1074 264.506C42.7591 285.873 109.689 280.424 173.664 269.214C185.961 267.04 198.239 264.653 210.522 262.192C268.123 250.646 326.31 237.823 385.364 239.716C404.423 240.311 423.195 242.458 441.695 246.186C567.174 271.634 669.767 368.818 751.452 469.46C757.378 476.764 763.255 484.126 769.115 491.531C855.618 600.65 942.535 708.09 1047.09 777.182C1090.46 805.852 1135.66 836.556 1191.98 838.232C1259.15 840.334 1324.29 803.204 1375.98 761.714C1411.19 733.465 1442.95 702.485 1477.57 675.256C1493.85 662.472 1510.75 650.553 1528.95 640.019C1644.66 573.123 1800.71 577.336 1928.55 633.007C2056.53 688.73 2159.77 788.785 2241.16 901.861",
  "M-132.619 65.6142C-150.95 135.244 -101.014 207.824 -36.5137 238.322C-30.7599 241.049 -24.9134 243.479 -18.9611 245.645C41.6408 267.675 108.522 263.052 172.605 252.602C184.937 250.596 197.238 248.346 209.512 246.035C267.18 235.157 325.469 222.912 384.431 225.101C403.467 225.816 422.222 228.006 440.686 231.823C566.109 257.735 668.223 355.087 749.074 456.345C754.951 463.707 760.767 471.095 766.534 478.54C851.958 588.306 936.883 697.078 1039.2 769.254C1082.76 799.969 1128.47 832.722 1185.98 835.099C1254.61 838.039 1321.1 799.448 1373.26 756.147C1408.78 726.663 1440.57 694.208 1475.42 665.636C1491.77 652.193 1508.85 639.651 1527.24 628.556C1644.36 558.017 1804.3 561.654 1934.7 618.828C2065.23 676.054 2169.88 779.129 2252.48 894.943",
  "M-132.324 45.9289C-150.682 115.497 -101.427 188.113 -37.2975 219.284C-31.5612 222.055 -25.75 224.574 -19.8154 226.783C40.5086 249.445 107.369 245.711 171.558 236.02C183.912 234.151 196.205 232.052 208.501 229.878C266.236 219.666 324.614 207.969 383.496 210.486C402.497 211.289 421.248 213.554 439.708 217.447C565.073 243.822 666.711 341.343 746.726 443.217C752.542 450.605 758.278 458.063 763.983 465.535C848.33 575.948 931.151 686.137 1031.34 761.281C1075.06 794.085 1121.29 828.888 1179.96 831.935C1250.04 835.681 1317.9 795.661 1370.48 750.53C1406.28 719.827 1438.13 685.913 1473.23 655.953C1489.72 641.87 1506.92 628.687 1525.54 617.017C1644.05 542.804 1807.91 545.927 1940.85 604.573C2073.91 663.271 2179.98 769.397 2263.77 887.962",
  "M-132.058 26.2597C-150.486 95.7487 -101.836 168.405 -38.0645 200.279C-32.3635 203.138 -26.5701 205.701 -20.684 207.968C39.4063 231.28 106.188 228.386 170.484 219.455C182.829 217.736 195.188 215.791 207.463 213.736C265.264 204.192 323.701 193.056 382.565 195.873C401.531 196.765 420.26 199.15 438.702 203.086C563.993 229.97 665.184 327.646 744.351 430.104C750.118 437.55 755.792 445.035 761.405 452.547C844.673 563.606 925.387 675.288 1023.46 753.355C1067.32 788.262 1114.08 825.07 1173.97 828.836C1245.51 833.419 1314.74 791.97 1367.74 745.009C1403.84 713.042 1435.78 677.701 1471.04 646.349C1487.63 631.638 1504.96 617.814 1523.81 605.569C1643.75 527.7 1811.47 530.261 1946.97 590.441C2082.58 650.611 2190.08 759.788 2275.07 881.091",
  "M-131.761 6.57552C-150.217 76.0027 -102.247 148.695 -38.833 181.272C-33.1807 184.189 -27.4048 186.796 -21.554 189.152C38.2716 213.127 105.019 211.09 169.421 202.919C181.789 201.336 194.139 199.542 206.48 197.642C264.335 188.734 322.887 178.207 381.673 181.351C400.616 182.362 419.327 184.791 437.721 188.785C562.955 216.133 663.638 313.991 742.032 417.038C747.706 424.523 753.363 432.053 758.926 439.622C841.117 551.328 919.617 664.51 1015.67 745.461C1059.6 782.499 1106.97 821.316 1168.06 825.738C1241.06 831.159 1311.63 788.25 1365.07 739.489C1401.49 706.289 1433.46 669.503 1468.94 636.777C1485.64 621.394 1503.11 606.96 1522.19 594.141C1643.54 512.629 1815.17 514.645 1953.21 576.297C2091.37 637.97 2200.3 750.154 2286.48 874.208",
  "M-131.479 -13.1409C-150.006 56.2069 -102.673 128.953 -39.6158 162.234C-33.9811 165.195 -28.2406 167.89 -22.4074 170.29C37.1712 194.884 103.853 193.717 168.345 186.35C180.748 184.936 193.107 183.248 205.439 181.498C263.361 173.257 322.002 163.278 380.708 166.749C399.617 167.848 418.292 170.366 436.682 174.435C561.858 202.247 662.077 300.304 739.623 403.936C745.249 411.479 750.812 419.048 756.314 426.644C837.396 539.01 913.652 653.707 1007.74 737.515C1051.74 776.682 1099.74 817.464 1162 822.631C1236.44 828.858 1308.38 784.52 1362.27 733.917C1398.97 699.497 1431.01 661.253 1466.74 627.139C1483.54 611.128 1501.16 596.04 1520.44 582.66C1643.18 497.474 1818.72 498.945 1959.31 562.1C2100.01 625.246 2210.37 740.511 2297.76 867.272",
  "M-131.183 -32.8251C-149.736 36.4608 -103.04 109.261 -40.367 143.183C-34.7809 146.201 -29.0446 148.972 -23.2601 151.429C36.0539 176.686 102.701 176.377 167.286 169.739C179.712 168.461 192.075 166.954 204.43 165.341C262.45 157.754 321.117 148.349 379.775 152.134C398.662 153.353 417.32 155.915 435.705 160.059C560.838 188.366 660.566 286.561 737.277 390.808C742.841 398.377 748.356 406.004 753.765 413.64C833.782 526.683 907.701 642.934 999.895 729.573C1043.92 770.927 1092.57 813.661 1156.02 819.485C1231.93 826.55 1305.22 780.751 1359.55 728.349C1396.56 692.696 1428.63 652.976 1464.59 617.518C1481.47 600.88 1499.23 585.151 1518.74 571.196C1642.88 482.368 1822.29 483.307 1965.45 547.921C2108.71 612.569 2220.48 730.855 2309.08 860.353",
  "M-130.918 -52.4957C-149.541 16.7107 -103.481 89.5652 -41.166 124.19C-35.5842 127.283 -29.9098 130.081 -24.1606 132.626C34.8888 158.546 101.488 159.063 166.193 153.216C178.61 152.089 191.027 150.705 203.373 149.242C261.459 142.322 320.216 133.466 378.795 137.578C397.646 138.884 416.299 141.521 434.649 145.754C559.725 174.525 658.99 272.92 734.852 377.751C740.367 385.378 745.79 393.045 751.137 400.707C830.076 514.397 901.565 632.242 991.953 721.672C1035.96 765.195 1085.29 809.868 1149.97 816.41C1227.37 824.299 1301.98 777.054 1356.74 722.853C1394.02 685.948 1426.18 644.801 1462.38 607.956C1479.38 590.646 1497.28 574.307 1517.02 559.777C1642.56 467.306 1825.87 467.67 1971.58 533.786C2117.37 599.907 2230.57 721.244 2320.35 853.493",
  "M-130.622 -72.1836C-149.272 -3.03889 -103.893 69.8518 -41.9042 105.166C-36.371 108.317 -30.7319 111.203 -24.9693 113.779C33.8464 140.35 100.38 141.737 165.179 136.619C177.618 135.628 190.039 134.426 202.394 133.069C260.534 126.785 319.407 118.538 377.893 122.946C396.722 124.372 415.327 127.067 433.672 131.375C558.66 160.623 657.478 259.173 732.506 364.619C737.959 372.273 743.333 379.997 748.601 387.731C826.461 502.067 895.507 621.476 984.117 713.758C1028.05 759.508 1078.14 806.094 1143.99 813.305C1222.82 822.001 1298.8 773.327 1354.03 717.313C1391.62 679.176 1423.82 636.584 1460.24 598.364C1477.34 580.427 1495.38 563.478 1515.33 548.342C1642.26 452.197 1829.49 452.047 1977.74 519.636C2126.05 587.272 2240.69 711.616 2331.68 846.603",
  "M-130.339 -91.8958C-149.06 -22.8305 -104.286 50.1008 -42.6992 86.1005C-37.2145 89.3091 -31.5798 92.27 -25.8658 94.9039C32.6719 122.107 99.1708 124.351 164.059 120.037C176.52 119.183 188.964 118.118 201.354 116.929C259.561 111.312 318.492 103.626 376.929 108.348C395.723 109.863 414.324 112.632 432.665 117.015C557.609 146.758 655.937 245.446 730.129 351.508C735.534 359.219 740.815 366.983 746.021 374.743C822.803 489.726 889.313 610.738 976.254 705.788C1020.11 753.735 1070.99 802.25 1138.02 810.162C1218.31 819.695 1295.64 769.561 1351.3 711.717C1389.17 672.36 1421.43 628.31 1458.07 588.716C1475.28 570.107 1493.46 552.548 1513.64 536.838C1641.98 437.05 1833.1 436.324 1983.9 505.416C2134.75 574.525 2250.81 701.919 2343.02 839.644",
  "M-130.042 -111.579C-148.79 -42.5757 -104.697 30.3919 -43.4367 67.0813C-37.9564 70.3651 -32.3835 73.3526 -26.6606 76.0925C31.6434 103.945 98.0768 107.06 163.072 103.505C175.538 102.833 187.99 101.874 200.402 100.822C258.677 95.8719 317.696 88.7338 376.085 93.7694C394.844 95.3724 413.422 98.2614 431.733 102.657C556.62 132.865 654.483 231.752 727.859 338.385C733.201 346.123 738.421 353.913 743.547 361.744C819.251 477.374 883.181 599.972 968.48 697.852C1012.2 748.052 1063.88 798.422 1132.12 807.022C1213.88 817.392 1292.56 765.797 1348.65 706.155C1386.83 665.565 1419.15 620.025 1456.02 579.088C1473.33 559.851 1491.67 541.638 1512.05 525.366C1641.77 421.905 1836.81 420.665 1990.2 491.246C2143.59 561.827 2261.07 692.273 2354.49 832.735",
  "M-129.779 -131.252C-148.597 -62.3275 -105.097 10.7117 -44.2378 48.0866C-38.8061 51.4278 -33.2376 54.4906 -27.5632 57.288C30.4762 85.8036 96.8616 89.745 161.963 86.9501C174.451 86.4149 186.939 85.6235 199.33 84.6908C257.671 80.408 316.792 73.8486 375.089 79.1804C393.826 80.9027 412.387 83.8358 430.662 88.3203C555.492 118.992 652.878 218.047 725.418 325.296C730.682 333.104 735.839 340.922 740.917 348.81C815.543 465.087 876.848 589.252 960.536 689.949C1004.11 742.372 1056.61 794.658 1126.04 803.959C1209.24 815.135 1289.29 762.112 1345.81 700.671C1384.28 658.86 1416.67 611.863 1453.75 569.551C1471.15 549.687 1489.62 530.833 1510.23 513.986C1641.36 406.882 1840.31 405.098 1996.23 477.151C2152.17 549.235 2271.06 682.701 2365.7 825.9",
  "M-129.482 -150.938C-148.327 -82.0763 -105.508 -9.00068 -45.0062 29.0772C-39.5922 32.4627 -34.059 35.6136 -28.4332 38.4685C29.3591 67.6031 95.6791 72.415 160.901 70.411C173.411 70.0127 185.89 69.3715 198.316 68.6066C256.724 64.991 315.904 58.9926 374.152 64.6381C392.854 66.4489 411.41 69.4572 429.681 74.0169C554.454 105.152 651.345 204.421 723.068 312.24C728.27 320.075 733.378 327.95 738.363 335.879C811.912 452.802 870.517 578.531 952.682 682.08C996.055 736.752 1049.46 790.884 1120.06 800.886C1204.73 812.899 1286.14 758.447 1343.1 695.132C1381.87 652.057 1414.31 603.646 1451.63 559.946C1469.16 539.41 1487.76 519.946 1508.6 502.525C1641.13 391.778 1843.97 389.418 2002.45 462.974C2160.93 536.53 2281.24 673.047 2377.09 818.984",
  "M-129.2 -170.657C-148.116 -101.874 -105.933 -28.7449 -45.7713 9.99186C-40.4058 13.4348 -34.8902 16.6302 -29.2688 19.5603C28.259 49.358 94.5443 55.0271 159.86 53.7519C172.392 53.4905 184.907 53.0172 197.311 52.3716C255.804 49.3788 315.054 43.9724 373.223 49.945C391.903 51.8751 410.411 54.941 428.677 59.5757C553.375 91.2193 649.807 190.612 720.695 299.047C725.848 306.94 730.864 314.854 735.787 322.809C808.257 440.379 864.119 567.654 944.792 674.042C987.96 730.964 1042.25 786.985 1114.06 797.674C1200.19 810.525 1282.95 754.613 1340.35 689.499C1379.43 645.191 1411.91 595.335 1449.45 550.26C1467.07 529.097 1485.83 508.979 1506.87 490.996C1640.79 376.575 1847.55 373.701 2008.57 448.73C2169.6 523.788 2291.32 663.326 2388.35 812.014",
  "M-128.936 -190.323C-147.878 -121.602 -106.345 -48.4495 -46.5712 -8.99638C-41.241 -5.46501 -35.7431 -2.22561 -30.1703 0.761936C27.0928 31.2228 93.3303 37.7183 158.735 37.2472C171.272 37.167 183.796 36.7997 196.266 36.3087C254.826 33.983 314.178 29.1552 372.255 35.424C390.899 37.4425 409.403 40.5835 427.634 45.3067C552.275 77.4143 648.243 177.007 718.282 286.026C723.374 293.946 728.341 301.918 733.171 309.913C804.563 428.129 857.637 556.933 936.876 666.208C979.763 725.375 1035 783.259 1108 794.649C1195.57 808.307 1279.69 750.965 1337.53 684.052C1376.89 638.524 1409.44 587.21 1447.18 540.73C1464.93 518.926 1483.79 498.18 1505.06 479.623C1640.38 361.559 1851.04 358.11 2014.61 434.641C2178.18 511.172 2301.32 653.76 2399.56 805.186",
  "M-128.638 -210.011C-147.62 -141.382 -106.754 -68.1626 -47.3073 -28.0197C-41.9947 -24.4441 -36.563 -21.1029 -30.9769 -18.0844C26.0525 13.0263 92.2246 20.3924 157.723 20.6501C170.282 20.7069 182.828 20.4763 195.289 20.1355C253.916 18.4769 313.327 14.2103 371.355 20.7929C389.995 22.8865 408.432 26.1292 426.677 30.8832C551.261 63.4549 646.751 163.216 715.987 272.837C721.029 280.814 725.904 288.826 730.686 296.879C801.013 415.773 851.272 546.043 929.077 658.206C971.683 719.617 1027.88 779.396 1102.09 791.473C1191.12 805.968 1276.6 747.166 1334.87 678.454C1374.54 631.693 1407.12 578.903 1445.12 531.067C1462.95 508.604 1481.98 487.235 1503.48 468.103C1640.2 346.396 1854.77 342.402 2020.88 420.405C2187 498.439 2311.58 644.034 2411.01 798.211",
  "M-128.342 -229.697C-149.078 -155.004 -99.5103 -74.7583 -31.8474 -36.9029C35.8023 0.921561 116.728 5.34993 194.262 4.02153C271.796 2.69313 350.763 -3.31659 425.682 16.5496C559.238 52.0022 658.882 164.407 728.087 283.93C797.337 403.471 844.719 535.235 921.165 650.289C963.459 713.959 1020.67 775.574 1096.06 788.352C1186.55 803.684 1273.38 743.423 1332.1 672.867C1390.83 602.312 1433.78 518.326 1501.73 456.62C1639.84 331.24 1858.32 326.701 2026.98 406.207C2195.64 485.713 2321.64 634.359 2422.28 791.274",
];

const max = paths.length - 1;

gsap.registerPlugin(MotionPathPlugin);

function getRandomNumber(excludedNumbers: number[]): number {
  const possibleNumbers = Array.from({ length: 15 }, (_, i) => i).filter((num) => !excludedNumbers.includes(num));
  if (possibleNumbers.length === 0) {
    return 0;
  }
  const randomIndex = Math.floor(Math.random() * possibleNumbers.length);
  return possibleNumbers[randomIndex];
}

const generateAnimationData = () => {
  const availableIndexes = [...Array(max).keys()];

  const previousDelays: Array<{ pathIndex: number; delay: number }> = [];

  return tools.map((tool, index) => {
    const itemIndex = availableIndexes[Math.floor(Math.random() * availableIndexes.length)];
    availableIndexes.splice(itemIndex, 1); // prevent duplicates

    // Index should be max and it has to start counting from 1 over again
    const pathIndex = itemIndex - Math.floor(itemIndex / max) * max + 1;
    const duration = 16;

    const neighbors = previousDelays.filter((d) => d.pathIndex === pathIndex - 1 || d.pathIndex === pathIndex + 1);

    // Cannot be in the offset range of neighbors delays
    // To prevent overlapping of the dots
    const delay = getRandomNumber(
      neighbors
        .map((d) => d.delay)
        .reduce((acc, curr) => {
          const numbers = [curr - 2, curr - 1, curr, curr + 1, curr + 2].filter((n) => n >= 0);

          return [...new Set([...acc, ...numbers])];
        }, [] as number[]),
    );

    previousDelays.push({ pathIndex, delay });

    const timeline = gsap.timeline({
      repeat: -1,
      delay,
      repeatRefresh: true,
    });

    const path = `#path${pathIndex}`;
    const item = `#idItem${index}`;
    const dot = `#idDot${index}`;
    const glow = `#idGlow${pathIndex}`;
    const label = `#idLabel${index}`;

    const props: Parameters<Animation>[0] = {
      // IDS
      path,
      item,
      dot,
      glow,
      label,
      // Settings
      timeline,
      delay,
      duration,
      // Other
      pathIndex,
      index,
    };

    return {
      ...tool,
      props,
    };
  });
};

export const Paths = () => {
  const isMounted = useIsMounted();
  const [data, setData] = useState<ReturnType<typeof generateAnimationData>>([]);
  const [width, height] = useWindowSize();

  const handleGenerateData = useCallback(() => {
    if (data?.length) return;
    const response = generateAnimationData();
    setData(response);
    return response;
  }, [data]);

  useLayoutEffect(() => {
    handleGenerateData();
    return () => {
      data.forEach((tool) => {
        tool.props.timeline.clear();
      });
    };
  }, [data, width, height, isMounted, handleGenerateData]);

  if (width < 768) {
    return null;
  }

  return (
    <>
      {data.map((tool) => (
        <Dot key={tool.props.index} id={tool.props.index} tool={tool} animation={tool.props} />
      ))}

      <svg
        id="paths"
        xmlns="http://www.w3.org/2000/svg"
        viewBox="0 0 2000 1000"
        fill="none"
        preserveAspectRatio="none"
        className="absolute min-w-[2000px] min-h-[1000px] h-full w-full opacity-30 pointer-events-none top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 -z-[1]"
      >
        <g id="rect" clipPath="url(#item)">
          {paths.map((path, i) => (
            <path
              key={i}
              id={`path${i}`}
              opacity="0.54"
              d={path}
              stroke="url(#paint0_radial_242_278)"
              strokeMiterlimit="10"
            />
          ))}
        </g>
        {data.map((tool) => (
          <Glow
            key={tool.props.index}
            id={tool.props.index}
            path={paths[tool.props.pathIndex]}
            pathIndex={tool.props.pathIndex}
          />
        ))}
        <defs>
          <clipPath id="item">
            <rect width="2000" height="1000" fill="white" transform="matrix(-1 0 0 1 2000 0)" />
          </clipPath>
          <radialGradient
            id="paint0_radial_242_278"
            cx="1"
            cy="-0.4"
            r="1.4"
            gradientUnits="userSpaceOnUse"
            gradientTransform="translate(352 34) rotate(90) scale(555 1560.62)"
            className="text-zinc-400 dark:text-zinc-600"
          >
            <stop offset="0.0666667" stopColor="currentColor" className="" />
            <stop offset="0.243243" stopColor="currentColor" />
            <stop
              offset="0.43594"
              stopColor="currentColor"
              stopOpacity="0"
              className="text-zinc-200 dark:text-zinc-400"
            />
          </radialGradient>
        </defs>
      </svg>
    </>
  );
};
